<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<script src="https://cdn.jsdelivr.net/pako/1.0.3/pako.min.js"></script>
<script>
'use strict';

// Initial object //////////////////////////////////////////////////////////////

const obj = [
  { foo: 'bar', baz: 'БАТ' },
  { abra: 1, cadabra: null }
]

// Convert /////////////////////////////////////////////////////////////////////

var str = JSON.stringify(obj);

// Compress ////////////////////////////////////////////////////////////////////

var result = window.pako.deflate(str);

// Send data to server
//
// Use multipart/form-data:
//
// - small overhead
// - well known format, easy to process anywhere
//
/////////////////////////////////////////////////////////

function send() {
  var xhr = new XMLHttpRequest;

  console.log('Sending data...');

  xhr.open('POST', 'http://localhost:8000/', true);

  var formData = new FormData(document.forms.person);
  var blob     = new Blob([ result ], { type: 'application/octet-stream'});

  formData.append('binson', blob);
  xhr.send(formData);

  setTimeout(send, 5000);
}

send();

</script>
</html>
<body>
Sending objects to server, run server code to see result.
</body>
